<template>
    <div class="footer">
        <div class="start">
            <div class="newsCenter">
                <h3 >新闻中心</h3>
                <div class="new">
                    <a href="/#/news/1">
                        <span title="公司新闻">公司新闻</span>
                    </a>
                    <a href="/#/news/0">
                        <span title="行业新闻">行业新闻</span>
                    </a>
                </div>
            </div>
            <div class="zuop">
                <h3>作品案列</h3>
                <div class="first">
                    <a href="javascript:void(0)">
                        <span title="网站建设">网站建设</span>
                    </a>
                    <a href="javascript:void(0)">
                        <span title="营销传播">营销传播</span>
                    </a>
                </div>
                <div class="secend">
                    <a href="javascript:void(0)">
                        <span title="形象策略">形象策略</span>
                    </a>
                    <a href="javascript:void(0)">
                        <span title="影像大片">影像大片</span>
                    </a>
                </div>
            </div>
            <div class="callMe">
                <h3>联系我们</h3>
                <p>电话：177 5492 8306</p>
                <p>邮箱：1300318294@qq.com</p>
                <p>地址：重庆泰斯特科技有限公司</p>
                <p>手机：177 5492 8306</p>
            </div>
            <div class="wxCode">
                <img src="../../assets/ew.jpg" alt="">
                <p>微信二维码</p>
            </div>
        </div>
        <p class="bottom_footer">重庆泰斯特科技有限公司 版权所有联系电话：177 5492 8306</p>
    </div>
</template>

<script>
    export default {
        name: "s_footer"
    }
</script>

<style lang="less" scoped>
.footer{
    width: 100%;
    height: 270px;
    background: #090B1A;
    position: relative;
    box-sizing: border-box;
    min-width: 1300px;
    padding-top: 30px;
    .start{
        width: 1200px;
        margin: 0 auto;
        .newsCenter{
            float: left;
            width: 150px;
            margin-left: 50px;
            h3{
                color: white;
                font-size: 15px;
                font-weight: 400;
            }
            .new{
                display: flex;
                justify-content: space-between;
                color: #aaaaaa;
                font-size: 12px;
                font-weight: 300;
                a{
                    color: #aaaaaa;
                }
            }
        }
        .zuop{
            float: left;
            margin-left: 100px;
            width: 180px;
            a{
                color: #aaaaaa;
            }
            h3{
                color: white;
                font-size: 15px;
                font-weight: 400;
            }
            .first{
                display: flex;
                justify-content: space-between;
                color: #aaaaaa;
                font-size: 12px;
                font-weight: 300;
                margin: 10px 0;

            }
            .secend{
                display: flex;
                justify-content: space-between;
                color: #aaaaaa;
                font-size: 12px;
                font-weight: 300;
                margin: 10px 0;

            }
        }
        .callMe{
            float: left;
            width: 200px;
            margin-left: 100px;
            h3{
                color: white;
                font-size: 15px;
                font-weight: 400;
            }
            p{
                color: #aaaaaa;
                font-size: 12px;
                font-weight: 300;
            }
        }
        .wxCode{
            float: right;
            /*margin-right: 100px;*/
            width: 150px;

            img{
                height: 100px;
                width: 100px;
                margin: 0 auto;
                display: block;
                margin-top: 30px;
            }
            p{
                color: #aaaaaa;
                font-size: 12px;
                font-weight: 300;
                text-align: center;
            }
        }
    }

    .bottom_footer{
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        box-sizing:  border-box;

        color: #aaaaaa;
        text-align: center;
        margin: 10px 0;
        font-size: 13px;
        font-style: italic;
        border-top: 1px solid #171944;
        /*margin-top: 30px;*/
        height: 45px;
        line-height: 45px;
    }
}
</style>
